<template>
  <div class="price-list">
    <div class="item">
      <div class="name">动物园全票</div>
      <div class="price">
        <div class="num"><i>￥</i>150</div>
        <div class="btn">立即预订</div>
      </div>
    </div>
    <div class="item">
      <div class="name">动物园全票</div>
      <div class="price">
        <div class="num"><i>￥</i>150</div>
        <div class="btn">立即预订</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'DetailPrice',
  data () {
    return {

    }
  }
}
</script>

<style lang="stylus" scoped>
  .price-list
    margin .3rem .24rem
    background #f8f8f8
    border-radius .12rem
    .item
      margin 0 .3rem
      padding .24rem 0
      display flex
      .name
        flex 1
        padding-top .1rem
      .price
        width 2.4rem
        color red
        text-align center
        .num
          font-size .6rem
          i
            font-size .24rem
        .btn
          margin .1rem auto 0
          width 1.6rem
          height .54rem
          line-height .54rem
          border-radius .3rem
          background red
          color #fff
    .item + .item
      border-top 1px solid #eee
</style>
